<template>
  <div class="big_box">
    <header>
      <h1>now is</h1>
      <h2>zhongxu</h2>
    </header>
    <main>
      <p>いらっしゃいませ</p>
      <p class="lmb">
        <a @click="goBack()">test view</a>
      </p>
    </main>

    <footer>
      <!-- © Copyright CERN 2023 -->
      <p><a @click="goBack()"> 点击返回</a></p>
    </footer>
  </div>
</template>
  
<script setup lang="ts">
console.log("仲序");

//返回上一页
const goBack = () => {
  window.history.back();
};
</script>
   
<style lang="scss" scoped>
@font-face {
  font-family: "cern";
  src: url("/fonts/cern-terminal.eot");
  src: url("/fonts/cern-terminal.eot?#iefix") format("embedded-opentype"),
    url("/fonts/cern-terminal.woff") format("woff"),
    url("/fonts/cern-terminal.ttf") format("truetype"),
    url("/fonts/cern-terminal.svg#icomoon") format("svg");
}

* {
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  line-height: normal;
}

article,
section,
aside,
header,
footer,
main {
  display: block;
}

.big_box {
  width: 100%;
  height: 100%;
  text-align: center;
  text-shadow: 0 0 10px;
  word-wrap: break-word;
  font: 100%/1.5em cern, monospace;
  color: hsl(150, 100%, 50%);
  background: #000;
  //   margin: 2em auto;
}

header {
  clear: both;
  padding-bottom: 2em;
}

h1 {
  font-size: 2rem;
  text-transform: uppercase;
}
h2 {
  font-size: 2rem;
  margin: 0.3em 0;
}

main {
  padding: 2em 0;
}
main p {
  font-size: 1.5rem;
  margin: 0.3em;
}

p.lmb {
  display: inline-block;
}
p.lmb a,
p.lmb a:visited {
  display: block;
  text-decoration: none;
  padding: 0.3em 0.5em;
  border: 1px solid hsl(150, 100%, 50%);
}
</style>
  